<template>
	<s-layout title="拼邮分类">
		<uni-forms
				ref="addressFormRef"
				v-model="state.model"
				validateTrigger="bind"
				labelWidth="160"
				labelAlign="left"
				border
				:labelStyle="{ fontWeight: 'bold' }"
		>
			<view class="bg-white form-box ss-p-x-30">
				<uni-forms-item name="expressNo" label="包裹编号" class="form-item">
					<uni-easyinput
							v-model="state.model.expressNo"
							placeholder="请填写包裹编号"
							:inputBorder="false"
							placeholderStyle="color:#BBBBBB;font-size:30rpx;font-weight:400;line-height:normal"
					>
						<template #right>
							<button style="width: 120rpx; color: #FFFFFF; background: #459cff" class="ss-reset-button ui-Shadow-Main" @tap="onScanPackNumber">扫码</button>
						</template>
					</uni-easyinput>
				</uni-forms-item>

			</view>
		</uni-forms>

		<su-fixed bottom :opacity="false" bg="" placeholder :noFixed="false" :index="10">
			<view class="footer-box ss-flex-col ss-row-between ss-p-20">
				<view class="ss-m-b-20" style="display: flex; justify-content: center">
					<button style="width: 80%; color: #FFFFFF; background: #459cff" class="ss-reset-button save-btn ui-Shadow-Main" @tap="onPackExpressInfo">查询</button>
				</view>
			</view>
		</su-fixed>

		<su-dialog ref="suDialogRef"
		           :show="state.expressInfo.show"
		           title="包裹详情"
		           @confirm="state.expressInfo.show = false"
		           @cancel="state.expressInfo.show = false">
			<view class="ss-flex-col ss-p-20">
				<text style="font-size: 30rpx; font-weight: bold; text-align: center">目标编号：{{ state.expressInfo.detail.id }}</text>
				<text style="font-size: 30rpx; font-weight: bold; text-align: center">箱子备注：{{ state.expressInfo.detail.note }}</text>
			</view>
		</su-dialog>
	</s-layout>
</template>

<script setup>
import { computed, watch, ref, reactive, unref } from 'vue';
import sheep from '@/sheep';
import { onLoad, onPageScroll } from '@dcloudio/uni-app';
import _ from 'lodash';
import { name, phone, detailAddress, region } from '@/sheep/validate/form';
// 引入baseUrl
import { baseUrl } from '@/sheep/config';

const addressFormRef = ref(null);
const state = reactive({
	showRegion: false,
	expressInfo: {
		show: false,
		detail: {

		}
	},
	model: {
		expressNo: '',
		targetId: '',
		wareTypeList: [
			{
				text: '煤炉',
				value: 0,
			}
		],
	}
});

//选择售后类型
function onRefundChange(e) {
	state.model.wareType = e.detail.value;
}

function onSearch() {
	if (sheep.$helper.isRealEmpty(state.model.targetId)) {
		sheep.$helper.toast('请填写目标编号');
		return;
	}
	sheep.$api.order.expressSearch({
		expressNo: state.model.targetId
	}).then(res => {
		if (!sheep.$helper.isRealEmpty(res)) {
			state.expressInfo.detail = res;
			state.expressInfo.show = true;
		}
	})
}

function onPackExpressInfo() {
	if (sheep.$helper.isRealEmpty(state.model.expressNo)) {
		sheep.$helper.toast('请填写包裹编号');
		return;
	}
	sheep.$api.order.expressDetail({orderId: state.model.expressNo}).then(res => {
		state.expressInfo.detail = res
		console.log(state.expressInfo.detail)
		if (sheep.$helper.isRealEmpty(state.expressInfo.detail.orderId)) {
			sheep.$helper.toast('未查询到包裹信息')
			return
		}
		sheep.$router.go('/pages/order/express/detail', {
			id: state.expressInfo.detail.orderId,
			wms: true
		});
	});
}

function onScanPackNumber() {
	uni.scanCode({
		scanType: ['barCode'],
		success: function (res) {
			console.log('条码类型：' + res.scanType);
			console.log('条码内容：' + res.result);
			state.model.expressNo = res.result
			state.model.expressNo = expressNo;
			sheep.$api.order.expressDetail({orderId: expressNo}).then(res => {
				state.expressInfo.detail = res
				console.log(state.expressInfo.detail)
				if (sheep.$helper.isRealEmpty(state.expressInfo.detail.orderId)) {
					sheep.$helper.toast('未查询到包裹信息')
					return
				}
				sheep.$router.go('/pages/order/express/detail', {
					id: state.expressInfo.detail.orderId,
					wms: true
				});
			});
		}
	});
}

function onScanPackNumberTarget() {
	uni.scanCode({
		scanType: ['barCode'],
		success: function (res) {
			console.log('条码类型：' + res.scanType);
			console.log('条码内容：' + res.result);
			state.model.targetId = res.result
		}
	});
}

async function onSave() {
	if (sheep.$helper.isRealEmpty(state.model.expressNo)) {
		sheep.$helper.toast('请填写当前包裹编号');
		return;
	}

	if (sheep.$helper.isRealEmpty(state.model.targetId)) {
		sheep.$helper.toast('请填写目标包裹编号');
		return;
	}

	await sheep.$api.order.moveExpress({
		expressNo: state.model.expressNo,
		targetId: state.model.targetId,
	}).then(res => {
		let content = "";
		if (!sheep.$helper.isRealEmpty(res.id)) {
			content = `合箱成功(●'◡'●)`;
		} else {
			content = `合箱失败ಠ_ಠ | 请重新尝试，多次失败请联系管理员~`;
		}

		uni.showModal({
			title: '提示',
			content: content,
			showCancel: false,
			success: function (res) {
				if (res.confirm) {
					uni.reLaunch({
						url: '/pages/app/move'
					});
				}
			}
		});
	})
}

onLoad(async (options) => {

});
</script>

<style lang="scss" scoped>
:deep() {
	.uni-forms-item__label .label-text {
		font-size: 28rpx !important;
		color: #333333 !important;
		line-height: normal !important;
	}

	.uni-easyinput__content-input {
		font-size: 28rpx !important;
		color: #333333 !important;
		line-height: normal !important;
		padding-left: 0 !important;
	}

	.uni-easyinput__content-textarea {
		font-size: 28rpx !important;
		color: #333333 !important;
		line-height: normal !important;
		margin-top: 8rpx !important;
	}

	.uni-icons {
		font-size: 40rpx !important;
	}

	.is-textarea-icon {
		margin-top: 22rpx;
	}

	.is-disabled {
		color: #333333;
	}
}

.default-box {
	width: 100%;
	box-sizing: border-box;
	height: 100rpx;

	.default-box-title {
		font-size: 28rpx;
		color: #333333;
		line-height: normal;
	}
}

.footer-box {
	.save-btn {
		width: 710rpx;
		height: 80rpx;
		border-radius: 40rpx;
		background: linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));
		color: $white;
	}

	.cancel-btn {
		width: 710rpx;
		height: 80rpx;
		border-radius: 40rpx;
		background: var(--ui-BG);
	}
}
</style>
